<template>
    <router-view></router-view>
    <div class="footer fixed bottom-0 h-[4rem]" v-if="homeActive != 2">
        <FootBar></FootBar>
    </div>
</template>

<script setup lang="ts">
import FootBar from '@/components/footBar.vue';
import { useIconStore } from '@/stores/IconStore';
import { toRefs, watchEffect } from 'vue';
import { useRoute } from 'vue-router';

const activeState = useIconStore()
const { homeActive } = toRefs(activeState)
const { changeItem } = activeState

const route = useRoute()
console.log(route);

watchEffect(() => {
    const path = route.path.split('/')[1]
    changeItem(path);
});
</script>

<style lang="scss" scoped></style>